<template>
  <zm-panel :visible.sync="value" @change="closeAfter" class="panelContainer">
    <div slot="title">
      <div class="dib">{{ customerName }}</div>
      <tag-type v-if="isApproval" :value="linkInfo.linkStatus || infoData.checkStatus" :msg="linkInfo.linkStatusMsg" />
    </div>

    <app-block class="optionBtn" v-if="isApproval&&isShowApproveBtn">
      <!-- 控制 在审批流里面才显示-->
      <template>
        <zm-button @click="onApprovalEdit" v-if="+linkInfo.isEdit === 1 && isWaitMe === '1'" plain>
          编辑
        </zm-button>

        <template v-if="infoData.checkStatus === '1'">
          <zm-button @click="onRevocation" plain type="info" v-if="+linkInfo.isSponsor">
            撤销审批
          </zm-button>
          <zm-button @click="onApproved('0')" type="danger" plain v-if="+linkInfo.isAction && isHiddenApproveBtn">
            审批驳回
          </zm-button>
          <zm-button @click="onApproved('1')" v-if="+linkInfo.isAction && isHiddenApproveBtn" plain type="success">
            审批通过
          </zm-button>
        </template>
        <zm-button @click="submitAppro" v-if="showBaseBtn" plain>
          提交审批
        </zm-button>
      </template>
    </app-block>

    <app-block class="mb15 optionBtn" v-if="isShowBtn">
      <div v-if="!publicCustomer">
        <zm-button plain @click="onTransfer" t="submit" custtxt="转移客户"></zm-button>
        <zm-button plain @click="onMove" t="submit" custtxt="移入公海"></zm-button>
        <zm-button plain @click="onEdit" t="submit" custtxt="编辑客户"></zm-button>
        <zm-button plain @click="ondel" t="submit" custtxt="删除客户"></zm-button>
        <zm-button plain @click="ondelay" t="submit" custtxt="延期移入公海" :disabled="+formObj.isApprove===0" v-if="+formObj.isTip === 1 && +formObj.isPublic === 0"></zm-button>
        <!-- isTip = 0 不显示按钮  isApprove = 0 时 置灰 isPublic 1流入公海0未流入-->
      </div>
      <div v-if="publicCustomer">
        <zm-button @click="onReceive" t="submit" custtxt="领取客户"></zm-button>
      </div>
    </app-block>
    <app-block>
      <el-tabs v-model="form.tabType" @tab-click="tabChange" class="wp100 vm">
        <el-tab-pane :label="item.label" :name="item.value" v-for="(item, index) in OPERATE_TAB" :key="index" />
      </el-tabs>
      <component :is="form.tabType" :obj="obj || formObj" :id="id" v-if="!dataInfoVisible" @getCustomerName="getCustomerName" @getObj="getObj"></component>
    </app-block>
    <div slot="footer" class="tr">
    </div>
    <transfer-customer v-if="transParams.visible" v-model="transParams.visible" :nos="transParams.nos" :p-title="transParams.pTitle" :trans="transParams.trans" @after="transClose"></transfer-customer>
    <new-panel :obj="newParams.obj" v-model="newParams.visible" v-if="newParams.visible" :nos="transParams.nos" @after="refresh"></new-panel>
    <delay-panel :id="delayParams.id" v-model="delayParams.visible" v-if="delayParams.visible" @after="refresh"></delay-panel>
    <approve-input v-if="showApproveDialog" v-model="showApproveDialog" :type="approveObj.approveType" ref="approveDialog" @after-approve="afterApprove"></approve-input>
  </zm-panel>
</template>

<script>
import panelMixin from '@/mixins/panelMixin'
import { OPERATE_TAB } from '../detail/components/const'
import dataInfo from '../detail/components/dataInfo'
import saleInfo from '../detail/components/saleInfo'
import outstandPlanInfo from '../detail/components/outstandPlanInfo'
import outstandInfo from '../detail/components/outstandInfo'
import invoiceInfo from '../detail/components/invoiceInfo'
import followUpInfo from '../detail/components/followUpInfo'
import belongInfo from '../detail/components/belongInfo'
import operatInfo from '../detail/components/operatInfo'
import delayPanel from '../detail/components/delayPanel'

import TransferCustomer from '../transferCustomer'
import NewPanel from '../New'
import {
  checkHasOrder, deleteCheck
  , checkReceivePublic
  , receivePublic
} from '@/api/src/customer'

import approveMixin from '@/mixins/approveMixin'
import approveProcessApis from '@/api/src/approve'
import ApproveInput from '@/components/ApproveInput'
import TagType from '@/components/TagType'

export default {
  name: 'DetailCustomer',
  components: {
    dataInfo,
    saleInfo,
    outstandPlanInfo,
    outstandInfo,
    invoiceInfo,
    followUpInfo,
    belongInfo,
    operatInfo,
    delayPanel,
    TransferCustomer,
    NewPanel,
    ApproveInput,
    TagType
  },
  mixins: [panelMixin, approveMixin],
  props: {
    publicCustomer: {
      // 公海客户 详情 是否来自公海
      type: Boolean,
      default: false
    },
    businessId: {
      type: String,
      default: ''
    },
    processType: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      OPERATE_TAB,
      form: {
        tabType: 'dataInfo'
      },
      newParams: {
        visible: false,
        obj: {}
      },
      customerName: '',
      transParams: {
        visible: false,
        pTitle: '',
        trans: false
      },
      dataInfoVisible: false,
      delayParams: {
        visible: false,
        id: ''
      },
      formObj: {},
      linkInfo: {},
      infoData: {},
      showApproveDialog: false,
      noShowMessage: false // 作用 第一次进入需要提示, 操作按钮后不需要提示
    }
  },
  computed: {
    showBaseBtn () {
      return (
        ['2', '4'].includes(this.infoData.checkStatus) &&
        +this.linkInfo.isSponsor
      )
    },
    approveObj: {
      get () {
        return {
          businessId: this.businessId,
          processType: '11',
          approveType: '0' // 通过 或 驳回
        }
      },
      set () {
        console.log('approveObj set')
      }
    }
  },
  created () {
    this.getInfo()
  },
  mounted () {

  },
  methods: {
    async getInfo () {
      this.dataInfoVisible = true
      // productType 1兑换券，2卖品券，3点卡，4次卡，5优惠券
      // checkStatus 审核状态：0未提交，1未审批，2已拒绝，3已通过，4已退回
      this.$nextTick(() => {
        this.dataInfoVisible = false
      })
    },
    refresh () {
      this.getInfo()
      this.$emit('after')
    },
    async getApprove () {
      console.log(this.isApproval, 'this.isApproval')
      const _res = await approveProcessApis.getLinkStatus({
        businessId: this.businessId,
        processType: '11'
      })
      this.linkInfo = _res

      if (this.isShowApproveBtn && !this.noShowMessage && (this.linkInfo.linkStatus !== '2' && this.linkInfo.linkStatus !== '4')) {
        this.$message.warning(`该用户申请延期${this.infoData.postponeDays}天后移入公海，请确认审批`)
      }
    },
    getCustomerName (val) {
      this.customerName = val
    },
    onTransfer () {
      checkHasOrder({ customerIds: this.id }).then(r => {
        // isCan true可以操作，false不可操作
        if (r.isCan) {
          this.transParams = {
            visible: true,
            pTitle: '转移客户',
            nos: this.id,
            trans: true
          }
        } else {
          this.$alert('您选择的客户,含有未全部回款的销售单,请先督促回款在进行转移操作!', '转移客户', { confirmButtonText: '确定' })
        }
      })
    },
    onMove () {
      checkHasOrder({ customerIds: this.id }).then(r => {
        // isCan true可以操作，false不可操作
        if (r.isCan) {
          this.transParams = {
            visible: true,
            pTitle: '移入公海',
            nos: this.id,
            trans: false
          }
        } else {
          this.$alert('您选择的客户，含有未全部回款的销售单，请先督促回款再进行移入公海操作！', '移入公海', { confirmButtonText: '确定' })
        }
      })
    },
    onReceive () {
      checkReceivePublic({ customerIds: this.id })
        .then(r => {
          if (!r.isCan) {
            this.$alert(r.tip, '提示', {
              confirmButtonText: '确定',
              callback: action => {
                return
              }
            })
          } else {
            this.$confirm(
              '是否确认领取所选择的客户？领取后若未及时跟进/成交，客户将自动放回公海',
              '领取客户',
              {
                confirmButtonText: '确定领取',
                cancelButtonText: '取消',
                type: 'warning'
              }
            )
              .then(async () => {
                await receivePublic({ customerIds: this.id })
                this.$message.success('领取成功')
                this.$emit('after')
                this.close()
              })
              .catch(() => { })
          }
        })
        .catch(e => {
          console.log(e)
        })
    },
    onEdit () {
      this.newParams = {
        visible: true,
        obj: this.obj
      }
    },
    ondel () {
      deleteCheck({ id: this.id }).then(res => {
        if (!res.isCan) {
          this.$message.error(res.tipMessage)
          return
        }
        this.$confirm('是否确认删除该客户?', '删除', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            await api.customer.delete({ id: this.id })
            this.$message.success('删除成功')
            this.$emit('after')
            this.close()
          })
          .catch(() => { })
      }).catch(e => {
        console.log(e.content)
      })
    },
    ondelay () {
      this.delayParams = {
        visible: true,
        id: this.id
      }
    },
    tabChange () {

    },
    getObj (obj) {
      this.formObj = obj
      this.infoData = obj
      console.log(this.infoData, 'infoData')
      if (this.isApproval) {
        this.getApprove()
      }
    },
    transClose () {
      this.$emit('after')
      this.close()
    },
    closeAfter () {
      this.close()
      this.$emit('load-list')
    },

    onApprovalEdit () {
      console.log(this.$route.name, 'routename')
      let isApprove
      if (this.$route.name === 'approvalMgr') {
        isApprove = '1'
      } else {
        isApprove = ''
      }
      this.editParams = {
        visible: true,
        id: this.infoData.id,
        type: this.infoData.type,
        isApprove: isApprove
      }
    },
    async submitAppro () {
      await approveProcessApis.submit({
        ...{
          businessId: this.businessId,
          processType: '11'
        },
        linkName: this.customerName
      })
      this.$message.success('成功提交审批!')
      this.approveNoMessage()
      this.refresh()
    },
    approveNoMessage () {
      this.noShowMessage = true
    }
  }
}
</script>

<style>
</style>
